<!DOCTYPE HTML>
<html>
<head>
<title>Home</title>
<link href="css/bootstrap.css" rel="stylesheet" type="text/css" media="all">
<link href="css/style.css" rel="stylesheet" type="text/css" media="all" />
<link href="css/owl.carousel.css" rel="stylesheet">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="Inward Responsive web template, Bootstrap Web Templates, Flat Web Templates, Andriod Compatible web template, 
Smartphone Compatible web template, free webdesigns for Nokia, Samsung, LG, SonyErricsson, Motorola web design" />
<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
<script src="js/jquery-1.11.1.min.js"></script>
<link href='https://fonts.googleapis.com/css?family=Open+Sans:400,800italic,800,700italic,700,600italic,600,400italic,300italic,300' rel='stylesheet' type='text/css'>
<!--startsmothscrolling-->
<script type="text/javascript" src="js/move-top.js"></script>
<script type="text/javascript" src="js/easing.js"></script>
 <script type="text/javascript">
		jQuery(document).ready(function($) {
			$(".scroll").click(function(event){		
				event.preventDefault();
				$('html,body').animate({scrollTop:$(this.hash).offset().top},1200);
			});
		});
	</script>
<!--endsmothscrolling-->
<script>
$(document).ready(function(){
    $(".dropdown").hover(            
        function() {
            $('.dropdown-menu', this).stop( true, true ).slideDown("fast");
            $(this).toggleClass('open');        
        },
        function() {
            $('.dropdown-menu', this).stop( true, true ).slideUp("fast");
            $(this).toggleClass('open');       
        }
    );
});
</script>
</head>
<body>
		<!--header-->
			<div class="header">
				<div class="header-top">
				<nav class="navbar navbar-default">
			  <div class="container-fluid">
				<!--Brand and toggle get grouped for better mobile display-->
				<div class="navbar-header">
				  <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
					<span class="sr-only">Toggle navigation</span>
					<span class="icon-bar"></span>
					<span class="icon-bar"></span>
					<span class="icon-bar"></span>
				  </button>
					</div>
        <!--Collect the nav links, forms, and other content for toggling-->
    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
      <ul class="nav navbar-nav">
        <li class="active"><a href="index.html">Home<span class="sr-only">(current)</span></a></li>
        <li><a href="about.html" >About</a></li>
		<li><a href="services.html">Services</a></li>
		<li class="dropdown">
			<a href="#" class="dropdown-toggle" data-toggle="dropdown">Gallery<span class="caret"></span></a>
			<ul class="dropdown-menu" role="menu">
				<li><a href="gallery.html">Gallery 1</a></li>
				<li><a href="gallery.html">Gallery 2</a></li>
				<li><a href="gallery.html">Gallery 3</a></li>  
			</ul>
		</li>
		<li><a href="typo.html">Typo</a></li>
		<li><a href="blog.html">Blog</a></li>
		<li><a href="mail.html">Mail</a></li>
        </ul>
    </div><!--navbar collapse-->
  </div><!--container fluid-->
</nav>
	<div class="social-icons">
		<a href="#"><i class="icon1"></i></a>
		<a href="#"><i class="icon2"></i></a>
		<a href="#"><i class="icon3"></i></a>
		<a href="#"><i class="icon4"></i></a>
	</div>
	<div class="clearfix"></div>
</div>
			<div class="banner-center">
				<div class="container">
					<div class="logo">
						<h1><a href="index.html">Inward</a></h1>
					</div>
					<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed fringilla arcu eget venenatis imperdiet. Duis volutpat rhoncus fringilla. Nam pulvinar maximus risus, sed aliquam urna imperdiet quis.</p>
					<div class="button">
						<a href="services.html" class="button1 hvr-rectangle-in">our work</a>
						<a href="mail.html" class="button2 hvr-rectangle-in">contact us</a>
					</div>
				</div>
			</div>
		</div>
		<!--header-->
		<script src="js/bootstrap.js"></script>
		<!--services-->
		<div class="content">
			<div class="service">
				<div class="container">
					<h2>crazy services</h2>
					<div class="service-grids">
						<div class="col-md-3 service-grid">
						<h4><span class="glyphicon glyphicon-user" aria-hidden="true"></span>Consultation</h4>
						<p>Seunteger rutrum  etiam processus dynamicusqui sequitur mutationem consuetudium lectorum. </p>
						</div>
						<div class="col-md-3 service-grid">
						<h4><span class="glyphicon glyphicon-lock" aria-hidden="true"></span>Delivery</h4>
						<p>Seunteger rutrum  etiam processus dynamicusqui sequitur mutationem consuetudium lectorum. </p>
						</div>
						<div class="col-md-3 service-grid">
						<h4><span class="glyphicon glyphicon-book" aria-hidden="true"></span>order</h4>
						<p>Seunteger rutrum  etiam processus dynamicusqui sequitur mutationem consuetudium lectorum. </p>
						</div>
						<div class="col-md-3 service-grid">
						<h4><span class="glyphicon glyphicon-link" aria-hidden="true"></span>share</h4>
						<p>Seunteger rutrum  etiam processus dynamicusqui sequitur mutationem consuetudium lectorum. </p>
						</div>
						<div class="clearfix"></div>
					</div>
				</div>
			</div>
				<!--services-->
					<!--projects-->
					<div class="project">
						<div class="container">
							<h3>interior view</h3>
						</div>
					<div class="gallery-cursual">
						<!--requried jsfiles for owl-->
					<script src="js/owl.carousel.js"></script>
							<script>
								$(document).ready(function() {
									$("#owl-demo").owlCarousel({
										items : 4,
										lazyLoad : true,
										autoPlay : true,
										pagination : false,
									});
								});
							</script>
				<!--//requried-jsfiles-for owl-->
				<!--start content_slider-->
				<div id="owl-demo" class="owl-carousel text-center">
					<div class="item">
						<img class="lazyOwl" data-src="images/p1.jpg" "img-responsive" alt="name">
					</div>
					<div class="item">
						<img class="lazyOwl" data-src="images/p2.jpg" class="img-responsive" alt="name">
					</div>
					<div class="item">
						<img class="lazyOwl" data-src="images/p3.jpg" class="img-responsive" alt="name">
					</div>
					<div class="item">
						<img class="lazyOwl" data-src="images/p4.jpg" class="img-responsive" alt="name">
					</div>
					<div class="item">
						<img class="lazyOwl" data-src="images/p5.jpg" class="img-responsive" alt="name">
					</div>
					<div class="item">
						<img class="lazyOwl" data-src="images/p6.jpg" class="img-responsive" alt="name">
					</div>
					<div class="item">
						<img class="lazyOwl" data-src="images/p7.jpg" class="img-responsive" alt="name">
					</div>
					<div class="item">
						<img class="lazyOwl" data-src="images/p1.jpg" class="img-responsive" alt="name">
					</div>
					<div class="item">
						<img class="lazyOwl" data-src="images/p2.jpg" class="img-responsive" alt="name">
					</div>
					<div class="item">
						<img class="lazyOwl" data-src="images/p3.jpg" class="img-responsive" alt="name">
					</div>
				</div>
		<!--sreengallerycursual-->
			</div>
		</div>
		<!--projects-->
        <div class="copyrights">Collect from <a href="http://www.cssmoban.com/" >网页模板</a></div>
		<!--testimonials-->
			<div class="testimonials">
				<div class="container">
					<h3>testimonials</h3>
					<p>Aenean nonummy hendrerit mau phasellu porta. Fusce suscipit varius mi sed. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nulla dui. Fusce feugiat malesuada odio morbi. Ut viverra mauris justo, quis auctor nisi. Suspendisse sit amet diam diam, eget volutpat lacus. Vestibulum faucibus scelerisque nisl vitae scelerisque. Sed tristique metus eu…</p>
					<h4><a href="#">John Anderson</a></h4>
				</div>
			</div>
			<!--testimonials-->
				<!--new-->
			<div class="news">
				<div class="container">
					<h3>news</h3>
						<div class="news-grids">
							<div class="col-md-4 news-grid">
									<h5><span class="glyphicon glyphicon-calendar date" aria-hidden="true"></span> : 09 feb 2014</h5>
									<a href="single.html" class="mask">
									<img src="images/n1.jpg" class="img-responsive zoom-img" alt=""></a>	
									<h4><a href="single.html">Typi habent clar</a></h4>
									<p>Consec tetuer adipicing it. Praesebul lorem ipsum natoque penatibus et gnis dent.Lorem ipsum dolor sit ame. </p>
								</div>
							<div class="col-md-4 news-grid">
								<h5><span class="glyphicon glyphicon-calendar date" aria-hidden="true"></span> : 19 feb 2015</h5>
									<a href="single.html" class="mask">
									<img src="images/n2.jpg" class="img-responsive zoom-img" alt=""></a>
									<h4><a href="single.html">Eodem modo typi</a></h4>
									<p>Consec tetuer adipicing it. Praesebul lorem ipsum natoque penatibus et gnis dent.Lorem ipsum dolor sit ame. </p>
								</div>
							<div class="col-md-4 news-grid">
								<h5><span class="glyphicon glyphicon-calendar date" aria-hidden="true"></span> : 29 sep 2014</h5>
									<a href="single.html" class="mask">
									<img src="images/n3.jpg" class="img-responsive zoom-img" alt=""></a>	
									<h4><a href="single.html">Nam liber tempor</a></h4>
									<p>Consec tetuer adipicing it. Praesebul lorem ipsum natoque penatibus et gnis dent.Lorem ipsum dolor sit ame. </p>
								</div>
							<div class="clearfix"></div>
						</div>
				</div>
			</div>
		</div>
			<!--new-->
				<!--indicate-->
				<div class="indicate">
					<div class="container">
						<div class="indicate-grids">
							<div class="col-md-3 indicate-grid">
								<span class="glyphicon glyphicon-map-marker" aria-hidden="true"></span>
								<p>New York 9870 St Vincent</p>
							</div>
							<div class="col-md-3 indicate-grid">
								<span class="glyphicon glyphicon-earphone" aria-hidden="true"></span>
								<p>Telephone :  +1 800 603 6035</p>
							</div>
							<div class="col-md-3 indicate-grid">
								<span class="glyphicon glyphicon-envelope" aria-hidden="true"></span>
								<p>E-mail : <a href="mailto:example@mail.com"> example@mail.com</a></p>
							</div>
							<div class="col-md-3 indicate-grid">
								<span class="glyphicon glyphicon-send" aria-hidden="true"></span>
								<p>FAX :  +1 800 889 9898</p>
							</div>
							<div class="clearfix"></div>
						</div>
					</div>
				</div>
			<!--indicate-->
			<!--footer-->
		<div class="footer-section">
						<div class="container">
							<div class="footer-top">
						<p>Copyright &copy; 2015.Company name All rights reserved.<a target="_blank" href="http://www.cssmoban.com/">&#x7F51;&#x9875;&#x6A21;&#x677F;</a></p>
									</div>
							<script type="text/javascript">
						$(document).ready(function() {
							/*
							var defaults = {
					  			containerID: 'toTop', // fading element id
								containerHoverID: 'toTopHover', // fading element hover id
								scrollSpeed: 1200,
								easingType: 'linear' 
					 		};
							*/
							
							$().UItoTop({ easingType: 'easeOutQuart' });
							
						});
					</script>
				<a href="#" id="toTop" style="display: block;"> <span id="toTopHover" style="opacity: 1;"> </span></a>
				</div>
			</div>
</body>
</html>